import React, { Component } from 'react';
import { WeaDialog, WeaLocaleProvider } from 'ecCom';
import { WeaTableNew } from 'comsMobx';
import { inject, observer } from 'mobx-react';

const getLabel = WeaLocaleProvider.getLabel;
const WeaTable = WeaTableNew.WeaTable;

@inject('docVersionStore')
@observer
class DocVersionComponent extends Component {
  componentDidMount() {
    const { docVersionStore } = this.props;

    const docid = this.getQueryString('docid');
    const iswps = this.getQueryString('iswps');
    docid && docVersionStore.setDocid(docid);
    iswps && docVersionStore.setIswps(iswps);
    docVersionStore.getList();
  }

  render() {
    const { docVersionStore } = this.props;
    const { tableStore, onOperatesClick } = docVersionStore;
    return (
      <WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@aqgoux`}
        onCancel={this.removeDialog}
        title={getLabel('16384', '打开版本')}
        visible={true}
        style={{ width: '60%', height: '500px' }}
        hasScroll
        parentClassName="openVersionComponent"
      >
        <WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@6gm1wc`}
          comsWeaTableStore={tableStore}
          onOperatesClick={onOperatesClick}
          getColumns={this.getColumns}
        />
      </WeaDialog>
    );
  }

  getColumns = columns => columns.map((col) => {
    if (col.dataIndex == 'imageFileName') {
      return {
        ...col,
        title: col.title,
        className: 'customWrap',
        render: (text, record) => (
          <a onClick={() => this.openVersion(record.versionId, record.docid)}>{record.imageFileName}</a>
        ),
      };
    }
    return col;
  })

  removeDialog = () => {
    const isColumnShow = top.WfForm.getOdocConfig().docParam.isColumnShow;
    const isTextInFormCanEdit = top.WfForm.getOdocConfig().docParam.isTextInFormCanEdit;
    const isTextInForm = top.WfForm.getOdocConfig().docParam.isTextInForm;
    const docid = top.WfForm.getOdocConfig().docParam.docid;

    if (isTextInFormCanEdit && (isColumnShow == '1' || isTextInForm) && docid > 0) {
      if (isColumnShow == '1') {
        parent.document.getElementsByClassName('wf-req-form-odoc-iframe')[0].style.width = '100%';
      } else {
        parent.document.getElementById('requestdocInForm').style.width = '100%';
      }
    } else {
      parent.document.getElementsByClassName('req-workflow-odoc')[0].style.width = '100%';
    }
    top.showOrHideTextInForm(false);
    const openVersionComponent = parent.document.getElementsByClassName('openVersionComponent')[0];
    const iframe = parent.parent.document.getElementById('openVersionComponent');
    iframe.parentNode.removeChild(iframe);
    openVersionComponent.parentNode.removeChild(openVersionComponent);
  }

  getQueryString(name) {
    const reg = new RegExp(`(^|&)${name}=([^&]*)(&|$)`, 'i');
    const r = window.location.href.split('?')[1].match(reg);
    if (r != null) {
      return unescape(r[2]);
    }
    return null;
  }

  openVersion(versionId, docid) {
    const isOffice2015 = this.getQueryString('office2015');
    const iswps = this.getQueryString('iswps');
    if (iswps == 'true') {
      window.open(`${window.location.protocol}//${window.location.host}/odoc/odoc/index_odocpreview.jsp?mRecordID=${versionId}_${docid}&mFileType=.doc`, '_blank', 'height=100%,width=100%');
    } else if (isOffice2015 == 'false') {
      window.open(`${window.location.protocol}//${window.location.host}/odoc/odoc/office_odoc.html?mRecordID=${versionId}_${docid}&mFileType=.doc`, '_blank', 'height=100%,width=100%');
    } else {
      window.open(`${window.location.protocol}//${window.location.host}/odoc/odoc/weboffice2015/index.jsp?mRecordID=${versionId}_${docid}&mFileType=.doc`, '_blank', 'height=100%,width=100%');
    }
    this.removeDialog();
  }
}
export default DocVersionComponent;
